<template>
  <div>
    <el-card class="box-card" shadow="never">
      <div slot="header" class="clearfix" ref="form" :model="chabuForm">
        <el-row>
          <el-col :span="3">
            <i class="el-icon-user-solid"></i>
            <span>查询人员信息</span>
          </el-col>
        </el-row>
      </div>
      <div>
        <el-form size="mini" :model="chabuForm">
          <el-row>
            <el-col :span="4">
              <span>生产部门</span>
            </el-col>
            <el-col :span="4">
              <el-select v-model="chabuForm.buming" placeholder="请选择">
                <el-option
                  v-for="item in bumenxia"
                  :key="item.deptId"
                  :label="item.deptName"
                  :value="item.deptId"
                ></el-option>
              </el-select>
              <!-- <el-input v-model="chabuForm.deptName" size="mini"></el-input> -->
            </el-col>
            <el-col :span="3">
              <span>用户：</span>
            </el-col>
            <el-col :span="3">
              <el-input v-model="chabuForm.name" size="mini"></el-input>
            </el-col>
            <el-col :span="2">
              <span>状态：</span>
            </el-col>
            <el-col :span="3">
              <el-select v-model="chabuForm.zhuang" placeholder="请选择">
                <el-option label="在职" value="1"></el-option>
                <el-option label="离职" value="0"></el-option>
              </el-select>
            </el-col>
            <el-col :span="5">
              <el-button type="mini" @click="submitForm()">查询</el-button>
              <el-button type="mini" @click="dialogFormVisible = true">添加</el-button>
              <el-button type="mini" @click="submitDelete()">删除</el-button>
            </el-col>
          </el-row>
        </el-form>
      </div>
    </el-card>
    <br />
    <el-card class="box-card" shadow="never">
      <div slot="header" class="clearfix" ref="form" :model="chabuForm">
        <el-row>
          <el-col :span="3">
            <i class="el-icon-user-solid"></i>
            <span>人员信息列表</span>
          </el-col>
        </el-row>
      </div>
      <div>
        <el-table :data="kehuData" border style="width: 100%">
          <el-table-column prop="staffId" label="编号"></el-table-column>
          <el-table-column prop="loginName" label="登录名"></el-table-column>
          <el-table-column prop="staffName" label="姓名"></el-table-column>
          <el-table-column prop="staffTime" label="出生日期"></el-table-column>
          <el-table-column prop="sex" label="性别">
            <template slot-scope="scope">
              <el-link target="_blank">{{scope.row.sex==1?"男":"女"}}</el-link>
            </template>
          </el-table-column>
          <el-table-column prop="deptName" label="部门名称"></el-table-column>
          <el-table-column prop="majorId" label="专业"></el-table-column>
          <el-table-column prop="roleId" label="角色"></el-table-column>
          <el-table-column prop="telephone" label="联系电话"></el-table-column>
          <el-table-column prop="phone" label="手机"></el-table-column>
          <el-table-column prop="professionalId" label="职位"></el-table-column>
          <el-table-column prop="img" label="头像"></el-table-column>
          <el-table-column prop="managementId" label="管理职位"></el-table-column>
          <el-table-column prop="technologyId" label="技术职位"></el-table-column>
          <el-table-column prop="state" label="状态">
            <template slot-scope="scope">
              <el-link target="_blank">{{scope.row.state==1?"在职":"离职"}}</el-link>
            </template>
          </el-table-column>
          <el-table-column prop="entryTime" label="入职时间"></el-table-column>
          <el-table-column prop="resignationTime" label="离职时间"></el-table-column>
          <el-table-column prop="deptName" label="任职部门"></el-table-column>
          <el-table-column prop="staffId" label="序号"></el-table-column>
          <el-table-column fixed="right" label="操作" width="90">
            <template slot-scope="scope">
              <el-button @click="fantian(scope.row.staffId)" type="text" size="small">编辑</el-button>
              <el-button @click="shanchu(scope.row.staffId)" type="text" size="small">删除</el-button>
            </template>
            <!-- <template slot-scope="scope">
              <el-button @click="fantian(scope.row.staffId)" type="text" size="small">编辑</el-button>
              <el-button @click="bushan(scope.row.staffId)" type="text" size="small">删除</el-button>
            </template>-->
          </el-table-column>
        </el-table>
        <el-pagination
          @size-change="shujuxian"
          @current-change="shujuxian"
          :current-page.sync="pageIndex"
          :page-sizes="[3, 5, 7, 9]"
          :page-size.sync="pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="50"
        ></el-pagination>
      </div>
    </el-card>
    <!-- 添加弹框  -->
    <el-dialog title="添加部门" :visible.sync="dialogFormVisible">
      <el-form :model="buAddform" size="mini">
        <el-row>
          <el-col :span="12">
            <el-form-item label="姓名：" :label-width="formLabelWidth">
              <el-input v-model="buAddform.staffName" size="mini"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="登录名：" :label-width="formLabelWidth">
              <el-input v-model="buAddform.loginName" size="mini"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="密码：" :label-width="formLabelWidth">
              <el-input v-model="buAddform.passWord" size="mini"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="出生日期：" :label-width="formLabelWidth">
              <el-date-picker v-model="buAddform.staffTime" type="date" placeholder="选择日期"></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="性别：" :label-width="formLabelWidth">
              <el-select v-model="buAddform.sex" placeholder="请选择">
                <el-option label="男" value="1"></el-option>
                <el-option label="女" value="0"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="专业：" :label-width="formLabelWidth">
              <el-select v-model="buAddform.majorId" placeholder="选择专业">
                <el-option label="建筑" value="建筑"></el-option>
                <el-option label="结构" value="结构"></el-option>
                <el-option label="暖通" value="暖通"></el-option>
                <el-option label="给排水" value="给排水"></el-option>
                <el-option label="电气" value="电气"></el-option>
                <el-option label="室内" value="室内"></el-option>
                <el-option label="概预算" value="概预算"></el-option>
                <el-option label="人事行政" value="人事行政"></el-option>
                <el-option label="人力资源" value="人力资源"></el-option>
                <el-option label="行政" value="行政"></el-option>
                <el-option label="财务" value="财务"></el-option>
                <el-option label="网络设计" value="网络设计"></el-option>
                <el-option label="产品设计" value="产品设计"></el-option>
                <el-option label="规划" value="规划"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="部门名称：" :label-width="formLabelWidth">
              <el-select v-model="buAddform.deptId" placeholder="请选择">
                <el-option
                  v-for="item in bumenxia"
                  :key="item.deptId"
                  :label="item.deptName"
                  :value="item.deptId"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="角色：" :label-width="formLabelWidth">
              <el-select v-model="buAddform.roleId" placeholder="选择专业">
                <el-option label="院长" value="院长"></el-option>
                <el-option label="所长" value="所长"></el-option>
                <el-option label="主任工程师" value="主任工程师"></el-option>
                <el-option label="工程师" value="工程师"></el-option>
                <el-option label="网络管理员" value="网络管理员"></el-option>
                <el-option label="所长助理" value="所长助理"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="邮箱：" :label-width="formLabelWidth">
              <el-input v-model="buAddform.email" size="mini"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="手机：" :label-width="formLabelWidth">
              <el-input v-model="buAddform.phone" size="mini"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="联系电话：" :label-width="formLabelWidth">
              <el-input v-model="buAddform.telephone" size="mini"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="设计职称：" :label-width="formLabelWidth">
              <el-select v-model="buAddform.professionalId" placeholder="选择专业">
                <el-option label="国家一级注册建筑师" value="国家一级注册建筑师"></el-option>
                <el-option label="国家一级注册结构工程师" value="国家一级注册结构工程师"></el-option>
                <el-option label="国家一级注册公用设备工程师（暖通空调）" value="国家一级注册公用设备工程师（暖通空调）"></el-option>
                <el-option label="国家注册电气工程师" value="国家注册电气工程师"></el-option>
                <el-option label="国家一级注册公用设备工程师（给排水）" value="国家一级注册公用设备工程师（给排水）"></el-option>
                <el-option label="国家注册城市规划师" value="国家注册城市规划师"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="管理职位：" :label-width="formLabelWidth">
              <el-select v-model="buAddform.managementId" placeholder="选择专业">
                <el-option label="总经理" value="总经理"></el-option>
                <el-option label="常务副总经理" value="常务副总经理"></el-option>
                <el-option label="副总经理" value="副总经理"></el-option>
                <el-option label="部门经理" value="部门经理"></el-option>
                <el-option label="部门副经理" value="部门副经理"></el-option>
                <el-option label="财务总监" value="财务总监"></el-option>
                <el-option label="人事行政部经理" value="人事行政部经理"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="技术职位：" :label-width="formLabelWidth">
              <el-select v-model="buAddform.technologyId">
                <el-option
                  v-for="item in Technical_Positiondate"
                  :value="item.dic_name"
                  :label="item.dic_name"
                  :key="item.dic_id"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-form-item label="职位隶属部门" :label-width="formLabelWidth">
            <el-checkbox-group >
              <el-checkbox name="type" label="经理办公室 "></el-checkbox>
              <el-checkbox label="建筑部 "></el-checkbox>
              <el-checkbox label="特务一部"></el-checkbox>
              <el-checkbox label="特务二部 "></el-checkbox>
              <el-checkbox label="研发部 "></el-checkbox>
              <el-checkbox label="室内部 "></el-checkbox>
              <el-checkbox label="结构部 "></el-checkbox>
              <el-checkbox label="设备部 "></el-checkbox>
              <el-checkbox label="电气部 "></el-checkbox>
              <el-checkbox label="成本部 "></el-checkbox>
              <el-checkbox label="项目管理部 "></el-checkbox>
              <el-checkbox label="总工办 "></el-checkbox>
              <el-checkbox label="人事行政部 "></el-checkbox>
              <el-checkbox label="财务部 "></el-checkbox>
              <el-checkbox label="特务三部 "></el-checkbox>
              <el-checkbox label="西安分公司 "></el-checkbox>
              <el-checkbox label="规划部 "></el-checkbox>
              <el-checkbox label="宏石艺典 "></el-checkbox>
              <el-checkbox label="测试部门1 "></el-checkbox>
            </el-checkbox-group>
          </el-form-item>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="在职状态：" :label-width="formLabelWidth">
              <el-select v-model="buAddform.state" placeholder="选择专业">
                <el-option label="在职" value="1"></el-option>
                <el-option label="离职" value="0"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="入职时间：" :label-width="formLabelWidth">
              <el-date-picker v-model="buAddform.entryTime" type="date" placeholder="选择日期"></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="上传头像：" :label-width="formLabelWidth">
              <el-input v-model="buAddform.img" size="mini"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="离职时间：" :label-width="formLabelWidth">
              <el-date-picker v-model="buAddform.resignationTime" type="date" placeholder="选择日期"></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="显示排序：" :label-width="formLabelWidth">
              <el-input v-model="buAddform.order" size="mini"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="BuAdd()">确 定</el-button>
      </div>
    </el-dialog>
    <!-- 修改弹框 -->
    <el-dialog title="编辑部门" :visible.sync="dialogXiuVisible">
      <el-form :model="buupdateform">
        <el-form-item label="部门ID" :label-width="formLabelWidth">
          <el-input v-model="buupdateform.deptId"></el-input>
        </el-form-item>
        <el-form-item label="上级部门" :label-width="formLabelWidth">
          <el-select v-model="buupdateform.depDepartment" placeholder="请选择">
            <el-option
              v-for="item in bumenxia"
              :key="item.deptId"
              :label="item.deptName"
              :value="item.deptId"
            ></el-option>
          </el-select>
          <!-- <el-input v-model="buupdateform.depDepartment"></el-input> -->
        </el-form-item>
        <el-form-item label="部门名称" :label-width="formLabelWidth">
          <el-input v-model="buupdateform.deptName"></el-input>
        </el-form-item>
        <el-form-item label="部门类型" :label-width="formLabelWidth">
          <el-select v-model="buupdateform.deptTypeId" placeholder="请选择">
            <el-option label="施工图部门" value="施工图部门"></el-option>
            <el-option label="方案部门" value="方案部门"></el-option>
            <el-option label="特殊部门（设计）" value="特殊部门（设计）"></el-option>
            <el-option label="特殊部门（行政）" value="特殊部门（行政）"></el-option>
            <el-option label="其他部门" value="其他部门"></el-option>
          </el-select>
          <!-- <el-input v-model="buupdateform.deptTypeId"></el-input> -->
        </el-form-item>
        <el-form-item label="部门描述" :label-width="formLabelWidth">
          <el-input v-model="buupdateform.deptDesc"></el-input>
        </el-form-item>
        <el-form-item label="是否显示" :label-width="formLabelWidth">
          <el-radio-group v-model="buupdateform.deptIndex">
            <el-radio :label="1">显示</el-radio>
            <el-radio :label="0">隐藏</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="排序" :label-width="formLabelWidth">
          <el-input v-model="buupdateform.staffId"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="bianjibu()">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  data() {
    return {
      chabuForm: {
        buming: "",
        name: "",
        zhuang: 0
      },
      kehuData: [],
      pageIndex: 1,
      pageSize: 3,
      totalCount: 0,
      buAddform: {
        loginName: "",
        staffName: "",
        staffTime: "",
        sex: 0,
        deptId: 0,
        majorId: "",
        roleId: "",
        passWord: "",
        email: "",
        phone: "",
        telephone: "",
        professionalId: "",
        managementId: "",
        technologyId: "",
        state: 0,
        img: "",
        order: 0,
        entryTime: "",
        resignationTime: ""
      },
      dialogFormVisible: false,
      dialogXiuVisible: false,
      bumenxia: [],
      formLabelWidth: "120px",
      buupdateform: {
        deptId: 0,
        depDepartment: 0,
        deptName: "",
        deptTypeId: "",
        deptIndex: 0,
        deptDesc: "",
        staffId: 0
      },
      Technical_Positiondate: []
    };
  },
  created() {
    //  this.loginUserName = this.$cookieTools.getLoginUser().user_name;
    this.shujuxian();
    this.XialYa();
    this.zidianxia();
  },
  methods: {
    shujuxian() {
      this.$myaxios(
        "DepartmentStaff/staffPoIndex?pageIndex=" +
          this.pageIndex +
          "&pageSize=" +
          this.pageSize +
          "&buming=" +
          this.chabuForm.buming +
          "&name=" +
          this.chabuForm.name +
          "&zhuang=" +
          this.chabuForm.zhuang
      ).then(r => {
        this.kehuData = r.data;
      });
    },
    BuAdd() {
      this.$myaxios
        .post("DepartmentStaff/StaffPoAdd", this.buAddform)
        .then(r => {
          if (r.data) {
            this.$message("添加成功");
            this.dialogFormVisible = false;
            this.shujuxian();
          }
        });
    },
    XialYa() {
      this.$myaxios.get("DepartmentStaff/departmentPoXia").then(r => {
        this.bumenxia = r.data;
      });
    },
    fantian(id) {
      this.$myaxios.get("DepartmentStaff/DepartmentPoOne?id=" + id).then(r => {
        this.dialogXiuVisible = true;
        this.buupdateform = r.data;
      });
    },
    // 部门修改
    bianjibu() {
      this.$myaxios
        .post("DepartmentStaff/DepartmentPoUpdate", this.buupdateform)
        .then(r => {
          if (r.data) {
            this.$message("修改成功");
            this.dialogXiuVisible = false;
            this.shujuxian();
          }
        });
    },
    // 部门删除
    bushan(id) {
      this.$myaxios
        .get("DepartmentStaff/DepartmentPoDelete?id=" + id)
        .then(r => {
          if (r.data) {
            this.$message("删除成功");
            this.shujuxian();
          }
        });
    },
    // 字典绑定下拉
    zidianxia() {
      this.$myaxios
        .get("Contract/GetDictionariesKey", {
          params: {
            typekey: "Technical-Position"
          }
        })
        .then(res => {
          this.Technical_Positiondate = res.data;
        });
    },
    // 人员删除
    shanchu(id){
      this.$myaxios.get("DepartmentStaff/StaffPoDelete?id="+id).then((r)=>{
        if(r.data)
        {
          this.$message("删除成功");
        }
      })
    },
    submitForm() {
      this.shujuxian();
    }
  }
};
</script>

<style>
</style>